<template>
  <div class="gonggao-publish-container">
    <div class="page-header">
      <h2>创建部门</h2>
    </div>

    <div class="form-container">
      <el-form :model="formData" ref="formRef" label-width="100px">
        <el-form-item label="部门名称" prop="title">
          <el-input v-model="formData.name" placeholder="请输入部门名称"></el-input>
        </el-form-item>
        <el-form-item label="部门编号" prop="title">
          <el-input v-model="formData.code" placeholder="请输入部门编号"></el-input>
        </el-form-item>
        <el-form-item label="部门排序" prop="title">
          <el-input v-model="formData.sort" placeholder="请输入部门排序编号"></el-input>
        </el-form-item>
        <el-form-item label="部门状态" prop="title">
          <el-switch v-model="formData.status" />
        </el-form-item>
        <!-- <el-form-item label="父部门Id" label-width="100px">
          <el-select  placeholder="请选择部门分类">
            <el-option />
          </el-select>
        </el-form-item> -->
        <el-form-item>
          <el-button type="primary" @click="submitForm">发布通告</el-button>
          <el-button @click="resetForm">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script setup lang="ts">
import { Bumenaddrequest } from '@/api/bumen';
import { ref } from 'vue'
// import { type Ibumen } from '@/api/bumen';
const formRef = ref(null);
const formData = ref({
  name: '',
  code: '',
  sort: 0,
  status: 1,
})
function resetForm() {
  formData.value.status = 1;
  formData.value.name = '';
  formData.value.code = '';
  formData.value.sort = 0;
}
async function submitForm() {
  await Bumenaddrequest( formData.value.name, formData.value.code,formData.value.sort, formData.value.status).then((res) => {
    console.log(res);
  })
}
</script>
<style lang="css" scoped>
.gonggao-publish-container {
  padding: 20px;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}

.page-header {
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ebeef5;
}

.page-header h2 {
  font-size: 20px;
  font-weight: 500;
  color: #303133;
  margin: 0;
}

.form-container {
  max-width: 800px;
}

.el-form-item {
  margin-bottom: 22px;
}

.el-button {
  margin-right: 15px;
}

.el-upload__tip {
  font-size: 12px;
  color: #606266;
  margin-top: 5px;
}
</style>
